<!-- 新增检测名称 -->
<template>
  <div id="dialog-container">
    <el-dialog v-dialogDrag title="新增检测名称" :fullscreen="isFullScreen" :custom-class="isFullScreen?'fullscreen-default-dialog':'vertical-center-dialog'" append-to-body :close-on-click-modal="false" :visible.sync="dialogVisible" @close="$emit('update:show', false)" :before-close="handleClose" :show="show" width="1200px">
      <button type="button" aria-label="fullScreen" class="el-dialog__headerbtn" style="margin-right:25px;top:" @click="isFullScreen = !isFullScreen">
                                                                                                  <i class="el-dialog__close iconfont icon-fuzhicopy22"></i>
                                                                                                </button>
      <el-form :model="formData" :rules="rules" :inline="true" ref="form" label-width="100px" size="small">
        <el-row>
          <el-col :span="12">
            <el-form-item label="检测类型：" prop="testType">
              <el-select v-model="formData.testType" filterable placeholder="请选择" style="width: 200px;">
                <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.code"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="检测项目：" prop="fieldName">
              <el-input v-model="formData.fieldName"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="检测标准：" prop="standard">
             <el-select v-model="formData.standard" filterable placeholder="请选择" style="width: 200px;">
                <el-option v-for="item in standardList" :key="item.id" :label="item.codeAndName" :value="item.code"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="序号：" prop="num">
              <el-input v-model="formData.num"></el-input>
            </el-form-item>
          </el-col>
           <el-col :span="12">
            <el-form-item label="占用设备时间（分钟）：" prop="occupy">
              <el-input v-model="formData.occupy"></el-input>
            </el-form-item>
          </el-col>
          <!-- <el-col :span="12">
            <el-form-item label="检测位置：" prop="testPart">
              <el-select v-model="formData.testPart" filterable placeholder="请选择" style="width: 200px;">
                <el-option v-for="item in positionList" :key="item.id" :label="item.name" :value="item.code"></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
        </el-row>
        <el-row>
          <hr>
          <h3>添加标尺/技术要求&数值范围</h3>
        </el-row>
        <el-row>
          <el-table :data="standardData" size="small">

            <el-table-column prop="standardName" label="标尺/技术要求" min-width="250">
              <template slot-scope="scope">
                <el-input  v-model="scope.row.standardName" size="small" style="width: 170px;">
                </el-input>
                <standardName-edit @inputEidt="inputEidt" style="display: inline-block;" :rowCount="scope.row" :standardName="scope.row.standardName"></standardName-edit>
              </template>
              </el-table-column>

           <!--     <el-table-column prop="operator" label="条件" min-width="100">
              <template slot-scope="scope">
                <el-select v-model="scope.row.operator" size="small"  placeholder="请选择" style="width: 100px;">
                  <el-option v-for="item in conditionList" :key="item.id" :label="item.name" :value="item.code"></el-option>
                </el-select>
              </template>
            </el-table-column>
             <el-table-column prop="col1" label="值1" min-width="100">
              <template slot-scope="scope">
                <el-input v-model="scope.row.col1" size="small" :disabled="getStatus(scope.row,'col1')">
                </el-input>
              </template>
                 </el-table-column>
            <el-table-column prop="col2" label="值2" min-width="100">
<template slot-scope="scope">
  <el-input v-model="scope.row.col2" size="small"  :disabled="getStatus(scope.row,'col2')">
  </el-input>
</template>

            </el-table-column>-->
            <el-table-column prop="unit" label="单位" min-width="100">
<template slot-scope="scope">
  <el-input v-model="scope.row.unit" size="small" >
  </el-input>
</template>
            </el-table-column>
            <el-table-column prop="decimalPoint" label="小数点" min-width="100">
<template slot-scope="scope">
  <el-input v-model="scope.row.decimalPoint" size="small" >
  </el-input>
</template>
       </el-table-column>
            <el-table-column prop="numberLimit" label="检测个数" min-width="100">
<template slot-scope="scope">
  <el-input v-model="scope.row.numberLimit" size="small" >
  </el-input>
</template>
            </el-table-column>
                  <el-table-column prop="deviceCode" label="设备" min-width="200">
<template slot-scope="scope">
  <el-input v-model="scope.row.deviceCode" size="small" disabled>
  </el-input>
</template>
            </el-table-column>
             <el-table-column prop="opera" align="center" min-width="100">
<template slot-scope="scope">
  <add-equipments-code @updateDevice="updateDevice" style="display: inline-block;" :rowCount="scope.row"></add-equipments-code>
</template>
  </el-table-column>
            <el-table-column prop="opera" align="center" label="操作" min-width="200">
<template slot-scope="scope">
  <el-button icon="el-icon-plus" plain size="mini" @click='addCondition' type="text">
  </el-button>
  <el-button icon="el-icon-minus" plain size="mini" @click='delCondition(scope.row)' type="text">
  </el-button>
</template>
            </el-table-column>
          </el-table>
        </el-row>
        <br>
        <el-row>
          <el-col :span="24">
            <el-form-item label="备注：">
              <el-input type="textarea" v-model="formData.remark" style="width: 566px;"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="verifyAdd">确 定</el-button>
        <el-button @click="handleClose">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  getTestFieldList,
  postSaveTestField,
  getTypeList,
  getPositionList,
  getStandardCondition,
  getTestFieldInfo,
  getStandardList
} from "service/task";
import AddEquip from "./add-equipments-code";
import StandardNameEdit from "./standardName-edit";
export default {
  components: {
    "add-equipments-code": AddEquip,
    "standardName-edit": StandardNameEdit
  },
  data() {
    return {
      conditionList: [],
      dialogVisible: false,
      isFullScreen: false,
      rowObject: {},
      formData: {
        testType: "",
        fieldName: "",
        standard: "",
        testPart: "",
        standard_type: "",
        standard_name: "",
        col1: "",
        condition: "",
        col2: "",
        unit: "",
        decimal_point: "",
        numberLimit: "",
        occupy: "",
        remark: "",
        num:""
      },
      decimalPointEdit: false,
      col1Edit: false,
      col2Edit: false,
      unitEdit: false,
      numberLimitEdit: false,
      standardData: [{}],
      tableData: [],
      typeList: [],
      positionList: [],
      rowCount: Object,
      standardName: String,
      standardList: [],

      rules: {
        testType: [
          {
            required: true,
            message: "请输入检测类型",
            trigger: "blur"
          }
        ],
        fieldName: [
          {
            required: true,
            message: "请输入检测项目名称",
            trigger: "blur"
          }
        ],
        // standard: [{
        //   required: true,
        //   message: '请输入检测标准',
        //   trigger: 'blur'
        // }],
        testPart: [
          {
            required: true,
            message: "请输入检测位置",
            trigger: "blur"
          }
        ]
      }
    };
  },
  props: {
    show: {
      type: Boolean,
      default: false
    },
    modifyId: {
      type: String
    }
  },
  watch: {
    show() {
      this.dialogVisible = this.show;
      if (this.dialogVisible) {
        getTypeList().then(res => {
          this.typeList = res.data.result;
        });
        getPositionList().then(res => {
          this.positionList = res.data.result;
        });
        getStandardCondition().then(res => {
          this.conditionList = res.data.result;
        });
         getStandardList().then(res => {
           this.standardList = [];
          let standardListTemp = res.data.result;
          for(let i = 0; i < standardListTemp.length; i++) {
            let objectTemp = {};
            objectTemp['code'] = standardListTemp[i]['code'];
            objectTemp['name'] = standardListTemp[i]['name'];
            objectTemp['codeAndName']  =  objectTemp['code'] + '-' + objectTemp['name'];
            this.standardList.push(objectTemp);
          }
        });
        if (this.modifyId) {
          getTestFieldInfo(this.modifyId).then(res => {
            this.formData = res.data.result;
            console.log(this.formData);
            this.standardData = res.data.result.fieldStandardList;
            if (this.standardData.length <= 0) {
              this.standardData.push({});
            }
          });
        }
      }
    }
  },
  updated() {
    //document.querySelector(".el-table_3_column_16 input").disabled = true;
  },
  methods: {
      getStatus(row,col){
          if(row.operator=='choose'){
              return true;
          }else if(row.operator=='range'){
              return false;
          }else{
              if(col=='col1'){
                  return false;
              }else{
                  return true;
              }
          }
      },
    chooseCondition(value, row) {
      this.rowObject = row;
      if(value == 'choose') {
      this.decimalPointEdit = true;
      this.col1Edit = true;
      this.col2Edit = true;
      this.unitEdit = true;
      this.numberLimitEdit = false;

      };
        if(value == 'equal') {
      this.decimalPointEdit = true;
      this.col1Edit = false;
      this.col2Edit = true;
      this.unitEdit = true;
      this.numberLimitEdit = false;

      };
      if(value == 'range') {
      this.decimalPointEdit = false;
      this.col1Edit = false;
      this.col2Edit = false;
      this.unitEdit = false;
      this.numberLimitEdit = false;

      };
      if(value == 'ge') {
      this.decimalPointEdit = true;
      this.col1Edit = false;
      this.col2Edit = true;
      this.unitEdit = true;
      this.numberLimitEdit = false;

      };if(value == 'gr') {
      this.decimalPointEdit = true;
      this.col1Edit = false;
      this.col2Edit = true;
      this.unitEdit = true;
      this.numberLimitEdit = false;

      };if(value == 'le') {
      this.decimalPointEdit = true;
      this.col1Edit = false;
      this.col2Edit = true;
      this.unitEdit = true;
      this.numberLimitEdit = false;

      };if(value == 'less') {
      this.decimalPointEdit = true;
      this.col1Edit = false;
      this.col2Edit = true;
      this.unitEdit = true;
      this.numberLimitEdit = false;

      };
    },
    addCondition() {
      this.standardData.push({});
     // document.querySelector(".el-table_3_column_16 input").disabled = true;
    },
    delCondition(row) {
      this.standardData.splice(this.standardData.indexOf(row), 1);
      if (this.standardData.length <= 0) {
        this.standardData.push({});
      }
    },
    handleClose() {
      /* 关闭的时候更新状态值 */
      this.dialogVisible = false;
      this.$refs["form"].resetFields();
      //this.tableData = [];
      this.formData = {};
      this.standardData = [];
      this.standardData.push({});
    },
    // 单选获取表格行
    getCurrentRow(index, row) {
      this.formData.standard_name = row.standard_name;
      this.formData.col1 = row.col1;
      this.formData.condition = row.condition;
      this.formData.col2 = row.col2;
      this.formData.unit = row.unit;
      this.formData.number_limit = row.numberLimit;
      this.formData.decimal_point = row.decimal_point;

    },
    // 检测项目blur事件
    // changeFName() {
    //   getTestFieldList({
    //     // this.axios.get('/system/testFieldList', {
    //     test_type: "",
    //     field_name: this.formData.field_name,
    //     pageNumber: 1,
    //     pageSize: 5,
    //     sort: "",
    //     order: ""
    //   }).then(res => {
    //     this.standardData = res.data.result.content;
    //   });
    // },
    // 更新设备列表
    updateDevice(row, deviceString, deviceList) {
      row.deviceCode = deviceString;
      this.standardData.splice(this.standardData.indexOf(row), 1);
      this.standardData.push(row);
    },
    inputEidt(row, inputValue) {
      row.standardName = inputValue;
      this.standardData.splice(this.standardData.indexOf(row), 1);
      this.standardData.push(row);
    },
    deleteDevice(index) {
      this.tableData.splice(index, 1);
    },
    // 确定
    verifyAdd() {
      //let deviceData = [];
      //for (let i = 0; i < this.tableData.length; i++) {
       // deviceData.push({
         // deviceId: this.tableData[i].id,
         // occupy: this.tableData[i].occupy
       // });
      //}

      this.$refs["form"].validate(valid => {
        if (valid) {
          for(let i = 0; i < this.standardData.length; i++) {
            let deviceCode = this.standardData[i]['deviceCode'];
            if(deviceCode == '' || deviceCode == undefined) {
              this.$alert("设备不能为空", "提示", {
                type: "warning"
              });
              return;
            }
        let col1 = this.standardData[i]['col1'];
        let col2 = this.standardData[i]['col2'];

                if(col2&&col1&&!(col2>col1)) {
              this.$alert("值2应大于值1", "提示", {
                type: "warning"
              });
              return;
            }
          }
          this.formData["fieldStandardListDto"] = this.standardData
          postSaveTestField(this.formData).then(res => {
            if (res.data.success) {
              this.$message({
            message: res.data.message,
            type: 'success',
            duration: 1000
            });
              this.$emit('refreshAdd');
              this.dialogVisible = false;
              this.formData = {};
             // this.tableData = [];
              this.standardData = [];
               this.standardData.push({});
            } else {
              this.$alert(res.data.message, "提示", {
                type: "error"
              });
            }
          });
        }
      });
    }
  }
};
</script>
